<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="copyright"
	content="All Rights Reserved, Copyright (C) 2017, Mengfanding Ltd." />
<title>设备后台管理系统</title>
<link rel="stylesheet" type="text/css"
	href="easyui/1.3.4/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="css/wu.css" />
<link rel="stylesheet" type="text/css"
	href="font-awesome-4.7.0/css/font-awesome.css" />
<link rel="stylesheet" type="text/css" href="css/icon.css" />
<script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="easyui/1.3.4/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="easyui/1.3.4/locale/easyui-lang-zh_CN.js"></script>
</head>

<body class="easyui-layout">
	<!-- begin of header -->
	<div class="wu-header"
		data-options="region:'north',border:false,split:false">
		<div class="wu-header-left">
			<h1>设备后台管理系统</h1>
		</div>
		<div class="wu-header-right">
			<p>
				<strong id="user">${user.name}</strong>，欢迎您！
			</p>
			<p>
				<!-- <a href="#">网站首页</a>| <a href="#">支持论坛</a>| <a href="#">帮助中心</a>|  -->
				<a href="/demo/user/quit">安全退出</a>
			</p>
		</div>
	</div>
	<!-- end of header -->
	<!-- begin of sidebar -->
	<div class="wu-sidebar"
		data-options="region:'west',split:true,border:true,title:'导航菜单'">
		<div class="easyui-accordion" data-options="border:false,fit:true">
			<div title="用户管理" data-options="iconCls:'icon-application-cascade'"
				style="padding: 5px;">
				<ul class="easyui-tree wu-side-tree">
					<li iconCls="icon-chart-organisation"><a
						href="javascript:void(0)" data-icon="icon-chart-organisation"
						data-link="" iframe="0">搜索用户</a></li>
				</ul>
			</div>
			<div title="设备管理" data-options="iconCls:'icon-application-form-edit'"
				style="padding: 5px;">
				<ul class="easyui-tree wu-side-tree">
					<li iconCls="icon-chart-organisation"><a
						href="javascript:void(0)" data-icon="icon-chart-organisation"
						data-link="temp/layout-2.html" iframe="0">设备查询</a></li>
				</ul>
			</div>
			<div title="设备分类管理"
				data-options="iconCls:'icon-application-form-edit'"
				style="padding: 5px;">
				<ul class="easyui-tree wu-side-tree">
					<li iconCls="icon-chart-organisation"><a
						href="javascript:void(0)" data-icon="icon-chart-organisation"
						data-link="layout-0.html" iframe="0">设备分类查询</a></li>

				</ul>
			</div>
			<div title="设备调用查询"
				data-options="iconCls:'icon-application-form-edit'"
				style="padding: 5px;">
				<ul class="easyui-tree wu-side-tree">
					<li iconCls="icon-chart-organisation"><a
						href="javascript:void(0)" data-icon="icon-chart-organisation"
						data-link="layout-0.html" iframe="0">设备调用查询</a></li>

				</ul>
			</div>
			<div title="设备维修查询"
				data-options="iconCls:'icon-application-form-edit'"
				style="padding: 5px;">
				<ul class="easyui-tree wu-side-tree">
					<li iconCls="icon-chart-organisation"><a
						href="javascript:void(0)" data-icon="icon-chart-organisation"
						data-link="temp/layout-3.html" iframe="0">设备维修查询</a></li>
				</ul>
			</div>
		</div>
	</div>
	<!-- end of sidebar -->
	<!-- begin of main -->
	<div class="wu-main" data-options="region:'center'">
		<div id="wu-tabs" class="easyui-tabs"
			data-options="border:false,fit:true">
			<div title="首页"
				data-options="href:'',closable:false,iconCls:'icon-tip',cls:'pd3'"></div>
		</div>
	</div>
	<!-- end of main -->
	<!-- begin of footer -->
	<div class="wu-footer"
		data-options="region:'south',border:true,split:true">Haxilili
		&copy; 2017 All Rights Reserved</div>
	<!-- end of footer -->
	<script type="text/javascript">
		test();
		function test() {
			var user = $("#user").text();
			if (user == null || user == "") {
				window.location.href = "login.html"
			}
		}

		$(function() {
			$('.wu-side-tree a').bind("click", function() {
				var title = $(this).text();
				var url = $(this).attr('data-link');
				var iconCls = $(this).attr('data-icon');
				var iframe = $(this).attr('iframe') == 1 ? true : false;
				addTab(title, url, iconCls, iframe);
			});
		})

		/**
		 * Name 载入树形菜单 
		 */
		$('#wu-side-tree').tree({
			//url:'temp/menu.json',
			data : [ {
				"id" : 1,
				"text" : "首页",
				"state" : "",
				"attributes" : {
					"url" : "",
					"icon" : ""
				},
				"children" : [ {
					"id" : 2,
					"text" : "系统管理",
					"state" : "",
					"attributes" : {
						"url" : "",
						"icon" : ""
					},
					"children" : [ {
						"id" : 3,
						"text" : "用户管理",
						"state" : "",
						"attributes" : {
							"url" : "datagrid.html",
							"icon" : ""
						}
					}, {
						"id" : 4,
						"text" : "角色管理",
						"state" : "",
						"attributes" : {
							"url" : "_content.html",
							"icon" : "icon-add"
						}
					}, {
						"id" : 5,
						"text" : "菜单管理",
						"state" : "",
						"attributes" : {
							"url" : "datagrid.html",
							"icon" : ""
						}
					}, {
						"id" : 6,
						"text" : "权限管理",
						"state" : "",
						"attributes" : {
							"url" : "_content.html",
							"icon" : ""
						}
					} ]
				} ]
			} ],
			cache : false,
			onClick : function(node) {
				var url = node.attributes['url'];
				if (url == null || url == "") {
					return false;
				} else {
					addTab(node.text, url, '', node.attributes['iframe']);
				}
			}
		});

		/**
		 * Name 选项卡初始化
		 */
		$('#wu-tabs').tabs({
			tools : [ {
				iconCls : 'icon-reload',
				border : false,
				handler : function() {
					$('#wu-datagrid').datagrid('reload');
				}
			} ]
		});

		/**
		 * Name 添加菜单选项
		 * Param title 名称
		 * Param href 链接
		 * Param iconCls 图标样式
		 * Param iframe 链接跳转方式（true为iframe，false为href）
		 */
		function addTab(title, href, iconCls, iframe) {
			var tabPanel = $('#wu-tabs');
			if (!tabPanel.tabs('exists', title)) {
				var content = '<iframe scrolling="auto" frameborder="0"  src="'
						+ href + '" style="width:100%;height:100%;"></iframe>';
				if (iframe) {
					tabPanel.tabs('add', {
						title : title,
						content : content,
						iconCls : iconCls,
						fit : true,
						cls : 'pd3',
						closable : true
					});
				} else {
					tabPanel.tabs('add', {
						title : title,
						href : href,
						iconCls : iconCls,
						fit : true,
						cls : 'pd3',
						closable : true
					});
				}
			} else {
				tabPanel.tabs('select', title);
			}
		}
		/**
		 * Name 移除菜单选项
		 */
		function removeTab() {
			var tabPanel = $('#wu-tabs');
			var tab = tabPanel.tabs('getSelected');
			if (tab) {
				var index = tabPanel.tabs('getTabIndex', tab);
				tabPanel.tabs('close', index);
			}
		}
	</script>
</body>

</html>